Skip to content

feat: Quickstart and client for Plain JS Script Tags#4161

Merged
clockwork-tien merged 6 commits intomasterfrom
tien/feat/js-script-tags
Feb 11, 2026
Merged

feat: Quickstart and client for Plain JS Script Tags#4161
clockwork-tien merged 6 commits intomasterfrom
tien/feat/js-script-tags

Conversation

@clockwork-tien
Copy link
Contributor

@clockwork-tien clockwork-tien commented Jan 29, 2026 •
edited
Loading

Description of Changes

The PR implements the following updates:

  • Create a quickstart guide and client support for using SpacetimeDB directly in browser with script tags
  • A template to easily work with/test the implementation and get started with script tags

The bundle is served via https://unpkg.com/spacetimedb@latest/dist/browser.bundle.js, which only works after the package is published to npm, therefore to test locally we can use the browser-ts template and local bundle:

  1. Build local bundle
cd crates/bindings-typescript
pnpm install
pnpm build
  1. Use local bundle built in templateindex.html (swap the URL from unpkg)
- <script src="https://unpkg.com/spacetimedb@latest/dist/browser.bundle.js"></script>
+ <script src="../../crates/bindings-typescript/dist/browser.bundle.js"></script>
  1. Open browser-ts/index.html directly in browser along with spacetime start + publish the module spacetime publish --project-path spacetimedb browser-ts

Screenshots

image image

API and ABI breaking changes

Expected complexity level and risk

Testing

@clockwork-tien clockwork-tien marked this pull request as ready for review January 29, 2026 14:36
@clockwork-tien clockwork-tien force-pushed the tien/feat/js-script-tags branch from 63a4d9c to c07dfef Compare January 29, 2026 15:52
cloutiertyler
cloutiertyler requested changes Jan 29, 2026
View reviewed changes
cloutiertyler and others added 3 commits January 30, 2026 09:39
@cloutiertyler
fix: Use DbConnection instead of custom Client for browser template
5573097 
Remove the custom Client class that used JSON protocol and HTTP for
reducer calls. Instead, use the standard DbConnection with code
generation, which uses BSATN binary protocol over WebSocket.

The browser-ts template now:
- Uses spacetime generate for TypeScript bindings
- Bundles bindings with vite into an IIFE
- Loads the bundle in index.html with inline JavaScript
@clockwork-tien
Merge branch 'master' of https://github.com/clockworklabs/SpacetimeDB …
03f9c1f 
…into tien/feat/js-script-tags
@clockwork-tien
chore: update template description
76678e1
@clockwork-tien
Copy link
Contributor Author

clockwork-tien commented Feb 2, 2026

@cloutiertyler Thank you, I have applied the changes from #4167, merged/resolved conflicts and did a minor template description update. The PR is ready for review.

@cloutiertyler cloutiertyler mentioned this pull request Feb 4, 2026
Closed
4 tasks
@cloutiertyler
Remove unused SDK browser bundle; clarify doc build step
4b6d425 
The IIFE and ESM browser bundles built from src/browser/index.ts
are not used by the browser-ts template (which bundles its own
bindings via Vite). The existing dist/index.browser.mjs already
covers the browser ESM use case for import maps.
@cloutiertyler
Copy link
Contributor

cloutiertyler commented Feb 10, 2026

Removed the SDK-level browser bundle (src/browser/index.ts, the IIFE and ESM browser configs in tsup.config.ts) since nothing in the template actually uses them. The template bundles its own bindings via Vite instead. The existing dist/index.browser.mjs (built from src/index.ts) already covers the browser ESM use case.

Long-term, the plan is to have the code generator emit .js + .d.ts files instead of .ts, which would allow the template to drop the Vite build step entirely and use import maps to resolve spacetimedb imports natively in the browser. At that point, the generated bindings would just work with a <script type="importmap"> pointing spacetimedb at dist/index.browser.mjs on unpkg.

@clockwork-tien clockwork-tien added this pull request to the merge queue Feb 11, 2026
Merged via the queue into master with commit aca374a Feb 11, 2026
32 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@cloutiertyler cloutiertyler cloutiertyler approved these changes

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

2 participants

@clockwork-tien @cloutiertyler

Comments